<template>
  <p>App</p>
</template>

<script lang="ts">
import {
  onBeforeMount,
  onMounted,
  onBeforeUpdate,
  onUpdated,
  onBeforeUnmount,
  onUnmounted,
  onActivated,
  onDeactivated,
  onErrorCaptured,
} from "vue";

export default {
  name: "App",
  // 组合式API入口，所有组合式API的内容都必须写在这个函数中
  // setup初始化渲染就会触发，相当于（取缔） beforeCreate 和 created
  setup() {
    // 所有生命周期都可以写n份
    onMounted(() => {
      console.log("onMounted 111");
    });

    console.log("setup");

    onBeforeMount(() => {
      console.log("onBeforeMount");
    });

    onMounted(() => {
      console.log("onMounted 222");
    });

    onMounted(() => {
      console.log("onMounted 333");
    });
  },
};
</script>
